<div class="main-container">

    <div class="main-content">
        <div class="content-top-bar">
            <div class="search-box">
                <nz-form-item class="fileItem">
                    <nz-form-label>年份</nz-form-label>
                    <nz-form-control>
                        <nz-year-picker [(ngModel)]="year" (ngModelChange)="getMonthDetailData()">
                        </nz-year-picker>
                    </nz-form-control>
                </nz-form-item>

                <button nz-button nzType="default" (click)="reset()">重置</button>
            </div>
            <!-- <div class="table-btn-group" *ngIf="listType=='0' && manageId != '10001'"> -->
            <div class="table-btn-group" *ngIf="manageId!=='1' || manageId===null">

                <button nz-button nzType="primary" style="margin-right: 20px" (click)="addPlan()">
                    计划填报
                </button>
            </div>
        </div>

        <div class="table-content dark-blue-table">
            <nz-table #monthPlan nzSize="middle" nzBordered [nzFrontPagination]="false" [nzData]="monthPlanDataFilter"
                [nzHideOnSinglePage]="true" [nzTotal]="total" [(nzPageIndex)]="pageNum" [(nzPageSize)]="pageSize"
                (nzPageIndexChange)="getGridData($event)">
                <thead>
                    <tr>
                        <th style="width: 75px">序号</th>
                        <th>计划名称</th>
                        <th>时间</th>
                        <!-- <th>状态</th> -->
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let row of monthPlan.data; let idx = index">
                        <td>{{ idx + 1 }}</td>
                        <td>{{ row.name }}</td>
                        <td>{{ row.cycle }}年 </td>
                        <!-- <td *ngIf="listType != '2'">{{ row.stateName }}</td>
              <td *ngIf="listType === '2'">{{ row.divStateName }}</td> -->
                        <td class="table-btn">
                            <!-- 上报数据 -->
                            <a *ngIf="listType === '0'" (click)="onEdit('view', row, 1)">查看</a>
                            <a *ngIf="manageId!=='1' || manageId===null" (click)="onEdit('edit', row, 1)"
                                [ngStyle]="{ 'point-events': 'none' }">修改</a>


                        </td>
                    </tr>
                </tbody>
            </nz-table>
        </div>
    </div>
    <nz-modal [(nzVisible)]="isVisible" nzTitle="新增年计划" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()">
        <form nz-form>
            <nz-form-item>
                <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>计划名称</nz-form-label>
                <nz-form-control [nzSm]="14" [nzXs]="24">
                    <input nz-input placeholder="请输入计划名称" [(ngModel)]="planNames"
                        [ngModelOptions]="{ standalone: true }" />
                </nz-form-control>
            </nz-form-item>

            <nz-form-item>
                <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>年份</nz-form-label>
                <nz-form-control [nzSm]="14" [nzXs]="24">
                    <nz-select name="select-error" [(ngModel)]="planYear" [ngModelOptions]="{ standalone: true }"
                        (ngModelChange)="changeYear($event)">
                        <nz-option nzValue="2016" nzLabel="2016"></nz-option>
                        <nz-option nzValue="2017" nzLabel="2017"></nz-option>
                        <nz-option nzValue="2018" nzLabel="2018"></nz-option>
                        <nz-option nzValue="2019" nzLabel="2019"></nz-option>
                        <nz-option nzValue="2020" nzLabel="2020"></nz-option>
                        <nz-option nzValue="2021" nzLabel="2021"></nz-option>
                        <nz-option nzValue="2022" nzLabel="2022"></nz-option>
                        <nz-option nzValue="2023" nzLabel="2023"></nz-option>
                        <nz-option nzValue="2024" nzLabel="2024"></nz-option>
                    </nz-select>
                </nz-form-control>
            </nz-form-item>

        </form>
    </nz-modal>
</div>